<script setup lang="ts">
import {computed, inject, ref, watch,reactive} from "vue";
import {Message} from "@arco-design/web-vue";
import AddModal from "@cps/actions/addModal.vue";
import car from '@/api/warehouse/car'
const size = ref('small');
const crudRef = inject('crudRef')
const baseinfo_data = inject('baseinfo_data')
const getDictData = inject('getDictData')
const refreshRecode = inject('refreshRecode')
const InfoDataLeft = ref([])
const InfoDataRight = ref([])
const addModalRef = ref()
watch(baseinfo_data, (value) => {
  if(value.id == undefined){
    return;
  } 
  console.log('刷新基础信息--'+baseinfo_data.value.id)
   InfoDataLeft.value =  [
      {label: '车牌号', value: baseinfo_data.value.number},
      {label: '出发地：', value: baseinfo_data.value.from},
      {label: '日期：', value: baseinfo_data.value.date},
      {label: '收货方：', value: baseinfo_data.value.billto},
      
    ]
   InfoDataRight.value = [
      {label: '状态：', value: getDictData('status',baseinfo_data.value.status,crudRef)},
      {label: '目的地：', value: baseinfo_data.value.to},
      {label: '承运商：', value: getDictData('supplier_service_id',baseinfo_data.value.supplier_service_id,crudRef)},
    ]
})
const edit = () => {
    addModalRef.value.open(
        reactive([
            {
                dataIndex:'id',
                disabled:true,
                addDisplay:false,
                addDefaultValue: baseinfo_data.value.id
            },
            {
                title: "出发地",
                dataIndex: "from",
                addDefaultValue: baseinfo_data.value.from,
                formType: "input",
            },
            {
                title: "目的地",
                dataIndex: "to",
                addDefaultValue: baseinfo_data.value.to,
                formType: "input",
            },
            {
                title: "日期",
                dataIndex: "date",
                addDefaultValue: baseinfo_data.value.date,
                formType: "date",
            },
            {
                title: "承运商",
                formType: "select",
                addDefaultValue: baseinfo_data.value.supplier_service_id,
                dataIndex: "supplier_service_id",
                dict: {
                    url: 'logistics/supplier/list',
                    props: {
                        label: 'name',
                        value: 'id'
                    },
                    translation: true
                },
            },
            {
                title: "收货方",
                addDefaultValue: baseinfo_data.value.billto,
                dataIndex: "billto",
                formType: "input",
            },
        ]) , {
        viewType: 'drawer',
        width: '70%',
        layout: [],
    }, car.updated,'车辆信息修改',function name(params) {
        refreshRecode(true)
    }) 
}

</script>
<template>
  <a-grid-item :span="24">
    <add-modal ref="addModalRef"></add-modal>
    <a-collapse :default-active-key="['1']" class="g-collapse">
      <a-collapse-item header="基础信息" key="1">
        <template #extra>
          <a-button-group>
            <a-button type="primary" size="small" @click.stop="edit()" v-auth="['warehouse:car:update']"><icon-edit/>编辑</a-button>
          </a-button-group>
        </template>
        <a-row class="">
          <a-col :span="12">
            <a-descriptions  :data="InfoDataLeft" :size="size" :column="1"  />
          </a-col>
          <a-col :span="12">
            <a-descriptions  :data="InfoDataRight" :size="size" :column="1"  />
          </a-col>
        </a-row>
      </a-collapse-item>
    </a-collapse>
  </a-grid-item>
</template>

<style scoped>

</style>